html{
	font-size:5vw;
}
*{
	padding:0;
	margin:0;	
}
.groupChat{
	position:relative;
	width:100vw;
	height:100vh;
}
.groupChat  li{
	list-style-type:none;
	
}
.groupChat .newsDiv{
	top:3rem;
	position:absolute;
	bottom:3rem;
	overflow-y:scroll;
}
.groupChat .newsDiv .showDiv{
	/* position:absolute; */
	/* bottom: 0; */
	width:100vw;
}
.groupChat footer{
	/* font-size:0.8rem; */
	position:absolute;
	height:3rem;
	width:100vw;
	border-top:1px solid rgba(200,200,200,0.5);
	border-bottom:1px solid rgba(200,200,200,0.5);
	bottom:0;
	background-color:rgb(240,240,240);	
} 
.groupChat footer img{
	width:1.5rem;
	height:1.5rem;
	margin:0.75rem;
}
.groupChat footer .right{
	float:right;
}
.groupChat footer .left{
	float:left;
}
.groupChat footer .input{
    position: absolute;
	top:0.5rem;
	background-color: rgb(255,255,255);
	height:2rem;
	width:10.8rem;
	font-size:1rem;
}
.groupChat header{
	/* font-size:0.8rem; */
	height:3rem;
	text-align:center;
	background-color: rgba(255,155,255,0.5);
	line-height:3rem;
}
.groupChat header .left{
    width:1.5rem;
	height:1.5rem;
	margin:0.5rem;
	float: left;
}
.groupChat header .right{
    width:1.5rem;
	height:1.5rem;
	margin-right:0.5rem;
	float: right;
}
.newsDiv .li{
	float: left;
	width:20rem;
}
.groupChat .newsDiv .text{
	text-align:center;
	font-size:20px;
}
.groupChat .newsDiv .img{
	width:2.5rem;
	height:2.5rem;
	margin-left:0.5rem;
	border-radius:0.2rem;
	float: left;
}
.groupChat .newsDiv .warp{
	padding-right: 0.3rem;
	padding-bottom: 0.3rem;
	padding-left: 0.3rem;
	top:1.5rem;
	margin-left:3.5rem;
}

.groupChat .newsDiv .showname{
	
	color:blue;
}
.groupChat .newsDiv .warp .zeroFive{
	font-size:1rem;
	width: 3rem;
	float:right;
	background-color: #000000;
}
.groupChat .newsDiv .len{
	position: relative;
	word-break:normal;
	word-break: break-all;
	margin:0.5rem;
	width:12rem;
}
.groupChat .newsDiv .showNews{
	border-radius:0.5rem;
	border:0.5rem solid #d5f0ff;
	background-color:#d5f0ff;
	font-size:40px;
	z-index: 10;
}
.groupChat .newsDiv .before-left:before{
	content:'';
	width:0;
	height:0;
	border-top:0.2rem solid transparent;
	border-bottom:0.5rem solid transparent;
	border-right:2rem solid #d5f0ff;
	position: absolute;
	left:-1.3rem;
	z-index: 0;
}
.groupChat .newsDiv .top{
	float: left;
	height:10rem;
	width: 100vw;
}
.groupChat footer .send{
	display: none;
	background-color: rgba(155,255,155,0.8);
	width:3rem;
	height:2rem;
	margin-top:0.5rem;
	margin-right:0.5rem;
	float:left;
	line-height: 2rem;
	text-align: center;
	transition: all 0.5 linear;
	
}
.groupChat footer .hide{
	display: none;
}
.groupChat footer .show{
	display: block;
}
.groupChat .my-right{
	float:right;
}
.groupChat .my-right .my-img{
	float: right;
	margin-right:0.5rem ;
}
.groupChat .my-right .my-name{
	float:right;
}
.groupChat .my-right .my-news{
	float:right;
	margin-right:0.5rem;
	text-align:right;
	border-radius:0.5rem;
	border:0.5rem solid #a5ffc2;
	background-color:#a5ffc2;
	z-index:10;
}

.groupChat .my-right .my-news:before{
	content:'';
	width:0;
	height:0;
	z-index:-10;
	border-top:0.2rem solid transparent;
	border-bottom:0.5rem solid transparent;
	border-left:2rem solid #a5ffc2;
	position: absolute;
	left:10.6rem;
	
}